<template>
    <div class="income-template" v-bind:dataValue="showLoading">
        <yd-navbar slot="navbar" title="密码重置" class="public-header">
            <span slot="left">
                <a href="javascript:window.history.go(-1)"><yd-navbar-back-icon></yd-navbar-back-icon></a>
            </span>
        </yd-navbar>
        <yd-cell-group>
            <yd-cell-item>
                <span slot="left">旧密码：</span>
                <yd-input slot="right" type="password" v-model="postDate.oldpassword" ref="oldpassword" placeholder="请输入旧密码" required></yd-input>
            </yd-cell-item>
            <yd-cell-item>
                <span slot="left">新密码：</span>
                <yd-input slot="right" type="password" v-model="postDate.newPassword" ref="newPassword" placeholder="请输入新密码" required></yd-input>
            </yd-cell-item>
            <yd-cell-item>
                <span slot="left">确认新密码：</span>
                <yd-input slot="right" type="password" v-model="postDate.rescheckPassword" ref="rescheckPassword" placeholder="请确认新密码" required></yd-input>
            </yd-cell-item>
        </yd-cell-group>
        <div class="m-button"><button class="btn-block btn-primary" @click="loginBtn">确定</button></div>
        <yd-tabbar slot="tabbar" class="public-footer">
            <yd-tabbar-item title="首页" link="/">
                <yd-icon name="home" slot="icon"></yd-icon>
            </yd-tabbar-item>
            <yd-tabbar-item title="投资收益" link="/income">
                <yd-icon name="shopcart-outline" slot="icon"></yd-icon>
            </yd-tabbar-item>
            <yd-tabbar-item title="信息交流" link="/message">
                <yd-icon name="like-outline" slot="icon"></yd-icon>
            </yd-tabbar-item>
            <yd-tabbar-item title="个人中心" link="/user" active>
                <yd-icon name="ucenter-outline" slot="icon"></yd-icon>
            </yd-tabbar-item>
        </yd-tabbar>
    </div>
</template>
<script>
    import Ajax from "../api/ajax.js";
    import dataURL from "../data/dataURL.js";
    import Md5 from 'js-md5'
    export default {
        data() {
            return {
                postDate: {
                    oldpassword: "",
                    newPassword: "",
                    rescheckPassword: ""
                },
                loadBloean:true
            }
        },
        methods: {
            async loginBtn() {
                for (var i in this.$refs) {
                    if (!this.$refs[i].valid) {
                        this.$dialog.toast({
                            mes: '请填写旧密码和新密码',
                            timeout: 500,
                        });
                        return;
                    }
                }
                let postDate = this.postDate;
                if (postDate.newPassword != postDate.rescheckPassword) {
                    this.$dialog.toast({
                        mes: '新密码与确认新密码不一致',
                        timeout: 500,
                    });
                    return;
                }
                try {
                    let res = await Ajax.Post(dataURL.user.password, {
                        old_password: Md5(postDate.oldpassword),
                        password: Md5(postDate.newPassword),
                    });
                    this.$dialog.toast({
                        mes: '新密码保存成功！',
                        timeout: 500,
                    });
                    console.log(res);
                } catch (error) {
                    console.log("error")
                }
            },
            async created() {
                this.loadBloean = false;
            }
        },
        computed: {
            showLoading() {
                if (this.loadBloean) {
                    this.$dialog.loading.open('很快加载好了');
                } else {
                    this.$dialog.loading.close();
                }
            }
        },
        mounted() {
            this.created();
        }

    }

</script>